<template>
  <a-tabs v-model:activeKey="activeKey">
    <a-tab-pane key="1">
      <template #tab>
        <span>
          <FolderOutlined />
          Nas文件存储
        </span>
      </template>
      <div class="text-left">
        <div>
          Nas地址：<a
            href="http://ccc.rjxnx.fun:5000/#/signin"
            target="_blank"
          ></a
          >http://ccc.rjxnx.fun:5000/#/signin
        </div>
        <div>用户名：reader</div>
        <div>密码：ONLYread123</div>
        <a-divider style="border-color: #7cb305" dashed />
        <div>后续资源会续持续更新...，分享不易，希望能真正帮到您！！！❥❥❥</div>
      </div>
    </a-tab-pane>
    <a-tab-pane key="2">
      <template #tab>
        <span>
          <CloudOutlined />
          免费云服务器
        </span>
      </template>
      <div class="text-left">
        <div>自己搭建的服务器，目前体量较小，免费赠送的，请期待后续...</div>
        <div>后续会有送免费服务器的想法...</div>
        <br />
        <a-image :width="200" :src="waitbear" />
      </div>
    </a-tab-pane>
    <a-tab-pane key="3" disabled>
      <template #tab>
        <span>
          <mail-outlined />
          ESXi
        </span>
      </template>
    </a-tab-pane>
  </a-tabs>
</template>

<script setup>
import {
  FolderOutlined,
  CloudOutlined,
  MailOutlined,
} from "@ant-design/icons-vue";
import { ref } from "vue";
import waitbear from "@/assets/waitbear.gif";

const activeKey = ref("1");
</script>

<style scoped>
.card-space {
  width: 700px;
  height: 370px;
}
</style>
